<route lang="json5" type="page">
{
  layout: 'default',
  style: {
    navigationBarTitleText: '我的订单',
  },
}
</route>
<template>
  <!-- 标签栏 -->
  <wd-tabs v-model="tab">
    <block v-for="item in tabs" :key="item">
      <wd-tab :title="`${item}`" :name="item">
        <view class="content bg-neutral-2 py-2">
          <my-order-card
            :order="order"
            v-for="order in filterList"
            :key="order.pid"
            @handleButton="updateOrderStatus"
          />
        </view>
      </wd-tab>
    </block>
  </wd-tabs>
</template>
<script lang="ts" setup>
import MyOrderCard from '@/components/my-order-card.vue'

const tabs = ref(['全部', '待支付', '待发货', '待收货', '待评价'])
const tab = ref('全部')

onLoad((options) => {
  if (options.tab) {
    tab.value = options.tab
  }
})

interface order {
  goods_list: object
  status: string
  order_no: string
}

const orderList = ref<Array<order>>([
  {
    goods_list: {
      price: 6377,
      name: '【XXXX40 Pro】XXXX60 Pro 6G手机',
      count: 1,
      sku_id: '667b6079fe544b2ae0a3cxxx',
      sku: '256G+12G',
    },
    status: '待支付',
    order_no: '3716463840117',
  },
  {
    goods_list: {
      price: 8366,
      name: '【XXXX40 Pro】XXXX80 Pro 8G手机',
      count: 1,
      sku_id: '667b6079fe544b2ae0a3caaa',
      sku: '256G+12G',
    },
    status: '待发货',
    order_no: '3716463840118',
  },
  {
    goods_list: {
      price: 7377,
      name: '【XXXX40 Pro】XXXX70 Pro 7G手机',
      count: 1,
      sku_id: '667b6079fe544b2ae0a3cbbb',
      sku: '256G+12G',
    },
    status: '待收货',
    order_no: '3716463840119',
  },
  {
    goods_list: {
      price: 9377,
      name: '【XXXX40 Pro】XXXX90 Pro 9G手机',
      count: 1,
      sku_id: '667b6079fe544b2ae0a3ccc',
      sku: '256T+12T',
    },
    status: '待评价',
    order_no: '3716463840120',
  },
])

onMounted(() => {
  getOrderList()
})

const getOrderList = async () => {
  const order = uniCloud.importObject('order') // 导入云对象
  try {
    const res = await order.getList()
    console.log(res)
    orderList.value = res.data
  } catch (e) {
    console.log(e)
  }
}

const updateOrderStatus = async (order_id: string) => {
  const order = uniCloud.importObject('order') // 导入云对象
  try {
    await order.update(order_id, '待评价')
    tab.value = '待评价'
    getOrderList()
  } catch (e) {
    console.log(e)
  }
}

const filterList = computed(() =>
  orderList.value.filter((item, i, orderList) => {
    return tab.value === '全部' || item.status === tab.value
  }),
)
</script>
<style lang="scss" scoped>
//
</style>
